<template>
	<view class="content login_content">
		<view class="banner">
			<image class="login_bg" src="../../static/images/massageChair_personCenter_bg.png" mode="widthFix"> </image>
			<view class="corp_info">
				<view class="headImage">
					<image class="logo" :src="imgBaseUrl + '../../static/images/logo200.png'" mode=""></image>
				</view>
				<view class="name">智能按摩用户</view>
			</view>
		</view>
		<view class="bottom_body">
			<view class="bottom_item" @click="goPage(1)">
				<view class="item_content">
					<image class="item_content_logo" :src="imgBaseUrl + '../../static/images/massageChair_personCenter_order.png'" mode=""></image>
					<view class="name">消费记录</view>
				</view>
				<view class="item_button">
					<image class="item_content_arrow" :src="imgBaseUrl + '../../static/images/massageChair_personCenter_arrow.png'" mode=""></image>
				</view>
			</view>
			<view class="bottom_item marTop24" @click="goPage(2)">
				<view class="item_content">
					<image class="item_content_logo" :src="imgBaseUrl + '../../static/images/massageChair_personCenter_kefu.png'" mode=""></image>
					<view class="name">联系客服</view>
				</view>
				<view class="item_button">
					<image class="item_content_arrow" :src="imgBaseUrl + '../../static/images/massageChair_personCenter_arrow.png'" mode=""></image>
				</view>
			</view>
		</view>


	</view>
</template>
<script>

export default {
	name: 'personCenter',
	data() {
		return {
			imgBaseUrl: "",
			// input输入框样式
			inputStyle: {
				backgroundColor: '#F6F9FCFF',
				color: '#1F2E49FF'
			},
			agreeProtocol: false,
			codeText: '获取验证码',
			codeStatus: true, // 是否可以点击获取验证码
			codeTime: 60, // 获取验证码按钮计时
			loginForm: {
				mobile: '',
				verifyCode: ''
			},
			popupContent: '账号未注册，请联系客服为您开通账号',
			cancelText: '取消',
			confirmText: '联系客服',
			otherPopupIndex: 1,
			wxLoginInfo: {
				appId: null,
				jsCode: null,
				phoneCode: null,
			}, // 微信授权登录需要参数
			accountInfo: {}, // 账号信息
			errMsg: ''
		};
	},
	created() {

	},
	methods: {
		goPage(type){ 
			var url=type==1?'/pages/massageChair/recordConsumer':'/pages/massageChair/contactCustom';
			uni.navigateTo({url})
		},
	
	}
};
</script>
<style lang="scss">
page {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	background-color: #f1f2f6;
	min-height: 100%;
	height: auto;
}






.content {
	position: relative;

	.banner {
		width: 100%;
		position: relative;

		.login_bg {
			display: block;
			width: 100%;
		}

		.corp_info {
			width: 90%;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			top: 36rpx;
			z-index: 1;
			.headImage{
				width: 120rpx;
				height: 120rpx;
				border-radius: 50%;
				overflow: hidden;
				background: #fff;
				.logo {
					display: block;
					width: 120rpx;
					height:120rpx;
				}
			}

			.name {
				margin-left: 32rpx;
				font-size: 36rpx;
				font-weight: 600;
				color: #1F2E49;

			}
		}
	}

	.bottom_body {
		padding: 32rpx 40rpx;
		position: absolute;
		top: 192rpx;
		width: 100%;
		box-sizing: border-box;

		.bottom_title {
			width: 128rpx;
			height: 44rpx;
			font-size: 32rpx;
			font-weight: 600;
			color: #1F2E49;
			margin-bottom: 8rpx;
		}

		.bottom_item {
			background: #fff;
			padding: 24rpx 24rpx;
			box-shadow: 0rpx 0rpx 20rpx 0rpx #E2E4ED;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.item_content {
				flex: 8;
				display: flex;
				align-items: center;
				justify-content: flex-start;
				.item_content_logo{
					width: 64rpx;
					height: 64rpx;
				}
				.name{
					margin-left: 24rpx;
					font-size: 32rpx;
					color: #1F2E49;
				}
			}
			.item_button {
				flex: 1;
				display: flex;
				align-items: center;
				justify-content: flex-end;
				.item_content_arrow {
					display: block;
					width: 16rpx;
					height: 29rpx;
				}

			}


		}
		.marTop24{
			margin-top: 24rpx;
		}






	}
}</style>
